<template>
  <div class="container">
     <Tabbar  style="position:fixed; background-color:#fff; z-index:999"/>
      <!-- <van-loading type="spinner" color="#1989fa" v-if="this.data4.length == 0" style="position:absolute;top:50%;left:50%"/> -->
   
    
    <div style="height:55px"></div>
    <van-cell title="申请人" :value="approver_name"/>
    <van-cell title="申请时间" :value="apply_time"/>
    <!-- 物料列表 -->
    <van-list>
      <div v-for="item in goodlist" :key="item.id">
      <van-swipe-cell style="margin-bottom:10px;">
            <van-card
              :num="item.buy_num"
              :desc="item.product_type"
              :title="item.product_name"
              :price="item.unit_price"
            />
            <span class="type">总价：{{item.total_price}}</span>
          </van-swipe-cell>
      </div>
    </van-list>
    <!-- 审核流程 -->
    <van-cell title="审核流程"/>
    <van-steps direction="vertical">
      <van-step style="height:80px; display:none;">
        <h4>【城市】物流状态1</h4>
        <p>2016-07-12 12:40</p>
      </van-step>
      <div v-for="(item,index) in process" :key="index">
        <van-step>
          <h2>{{item.approver_name}}</h2>
           <!-- <img :src="item.signpath" alt="" style="width:70px;height:50px;position:absolute;top:40px;left:170px;" v-show="item.flag"> -->
          <p>{{item.order_time}}</p>
          <span style="position:absolute;top:50%;right:30px">{{item.yesorno}}</span>
          <span>{{item.remarks}}</span>
        </van-step>
      </div>
    </van-steps>
    <!-- 备注 -->
    <van-field
      v-model="message"
      rows="2"
      autosize
      label="备注"
      type="textarea"
      maxlength="50"
      placeholder="请输入备注"
      show-word-limit
    />
    <!-- 价钱 -->
    <div class="price" v-if="flag2">
      <ul>
        <li v-for="(item,index) in goodlist" :key="index">
          <span class="name">{{item.product_name}}</span>
          <p><span>单价</span><input type="text" class="unit_price" v-model="item.unit_price" @change="sum(index)"></p>
          <p><span>总价</span><input type="text" class="total_price" v-model="item.total_price"></p>
        </li>
      </ul>
    </div>

    <!-- 上传图片 -->
  <!-- <van-uploader v-model="fileList" multiple :max-count="1" :after-read="afterRead"/> -->



    <!-- 曹总（第一次审批） -->
    <!-- <div class="footer" v-show="flag1">
      <van-button type="danger" round @click="nopass()">不通过</van-button>
      <van-button type="primary" round @click="pass1()">通过</van-button>
    </div> -->
    <div class="footer" v-show="flag1">
      <van-button type="danger" round @click="nopass()">不通过</van-button>
       <van-button type="warning" round @click="back()" v-show="flage">退回</van-button>
      <van-button type="primary" round @click="pass()" >通过</van-button>
     
    </div>
    <!-- 晓晓 -->
    <div class="footer" v-show="flag2">
      <!-- <van-button type="danger" round @click="nopass()">不通过</van-button> -->
      <van-button type="primary" round @click="containue()">提交</van-button>
    </div>
    <!-- 文旭 -->
    <div class="footer" v-show="flag3">
      <van-button type="primary" round @click="pay()">付款</van-button>
      
    </div>
    <!-- 项目经理 -->
    <div class="footer" v-show="flag4">
      <van-button type="primary" round @click="done()">已验收</van-button>
    </div>


    <!-- <van-action-sheet v-model="show1" :actions="actions" @select="onSelect1"/> -->
    <van-action-sheet v-model="show" :actions="nextapproverList" @select="onSelect"/>
    
  </div>
</template>
<script>
import axios from "axios";
import { getCookie } from "Utils/cookie";
import { Toast} from "vant";
import { setTimeout } from 'timers';
import Tabbar from 'Comp/Tabbar'
export default {
  data() {
    return {
      message:'',
        list:[],
        approver_name:'',
        apply_time:'',
        goodlist:[],
        process:[],
        flage:false,
        flag1:false,
        flag2:false,
        flag3:false,
        flag4:false,
        nextapproverList:[],
        show:false,
        apply_id:'',
        step_num:'',
        ask_prople:'',
        goodspirce:[],
        user_id:'',
        user_name:'',
        start_id:'',
        start_name:'',
    };
  },
  components:{
    Tabbar,
  },
  methods: {
    sum(index){
      this.goodlist[index].total_price = this.goodlist[index].unit_price * this.goodlist[index].buy_num + ''
      
    },
    nopass(){
      axios({
        url:'/hrkc/buyApply/askNext',
        methosd:'POST',
        params:{
          apply_status:'die',
          step_reason:this.message,
          apply_id:this.apply_id,
          step_num:this.step_num,
          id:this.apply_id
        }

      }).then(res=>{
        if(res.data.code == 0){
          this.$router.push('/goods_history')
        }
      })
    },
    back(){
      axios({
        url:'/hrkc/buyApply/askNext',
        methods:'POST',
        params:{
          userFlag:getCookie('user_flag'),
          apply_status:'ing',
          step_reason:this.message,
          apply_id:this.apply_id,
          step_num:this.step_num,
          user_id:this.user_id,
          user_name:this.user_name,
          step_advice:'退回重询',
          id:this.apply_id,
          // dtBuyProductList:JSON.stringify(this.goodlist)
        }
      }).then(res=>{
          if(res.data.code == 0){
            this.$router.push('/goods_application')
          }

      })
    },
    pass(){
      this.show = true
      console.log(' this.step_num', this.step_num)
      var judge = ''
      if(this.step_num == 2){
        judge = 'a'
      }else{
        judge = 'p'
      }
  //找下一审批人的
      axios({
         url: "/hrkc/buyApply/queryDtBuyUserList",
      method: "POST",
      params: {
        user_flag: getCookie("user_flag"),
        judge:judge
      }
      }).then(res=>{
        console.log('ren',res)
        this.nextapproverList = []
        for(var i=0; i<res.data.length;i++){
            this.nextapproverList.push({
              name:res.data[i].user_name,
              approver_id:res.data[i].id
          })
        }
      })
    },
    containue(){
      console.log('jiage',JSON.stringify(this.goodlist))
       axios({
        url:'/hrkc/buyApply/askNext',
        methods:'POST',
        params:{
          userFlag:getCookie('user_flag'),
          apply_status:'ing',
          step_reason:this.message,
          apply_id:this.apply_id,
          step_num:this.step_num,
          user_id:this.user_id,
          user_name:this.user_name,
          id:this.apply_id,
          dtBuyProductList:JSON.stringify(this.goodlist)
        }
      }).then(res=>{
          if(res.data.code == 0){
            this.$router.push('/goods_application')
          }

      })
    },
    pay(){
        axios({
        url:'/hrkc/buyApply/askNext',
        methods:'POST',
        params:{
          userFlag:getCookie('user_flag'),
          apply_status:'ing',
          step_advice:'付款成功',
          step_reason:this.message,
          apply_id:this.apply_id,
          step_num:this.step_num,
          user_id:this.start_id,
          user_name:this.start_name,
          id:this.apply_id,
        }
      }).then(res=>{
          if(res.data.code == 0){
            this.$router.push('/goods_application')
          }

      })


    },
    done(){
       axios({
        url:'/hrkc/buyApply/askNext',
        methods:'POST',
        params:{ 
          apply_status:'done',
          step_advice:'验收成功',
          step_reason:this.message,
          apply_id:this.apply_id,
          step_num:this.step_num,
          id:this.apply_id,
        }
      }).then(res=>{
          if(res.data.code == 0){
            this.$router.push('/goods_history')
          }

      })
    },
    onSelect(item){
      this.show = false
      var step_advice = ''
      if(this.step_num == 2){
        step_advice = '批准申请'
      }else{
        step_advice = '批准报价'
      }
      axios({
        url:'/hrkc/buyApply/askNext',
        methods:'POST',
        params:{
         userFlag:getCookie('user_flag'),
          apply_status:'ing',
          step_advice:step_advice,
          step_reason:this.message,
          apply_id:this.apply_id,
          step_num:this.step_num,
          user_id:item.approver_id,
          user_name:item.name,
          id:this.apply_id
        }
      }).then(res=>{
          if(res.data.code == 0){
            this.$router.push('/goods_application')
          }

      })
    }
  },
  mounted() {
      this.list = JSON.parse(this.$route.query.data)
      console.log('124578',JSON.parse(this.$route.query.data))
   axios({
      url:'/hrkc/buyApply/queryIngDetail',
      method:'GET',
      params:{
        apply_id:this.list.apply_id
        },
   }).then(res=>{
       console.log('结果',res)
       this.ask_prople = res.data.data3[res.data.data3.length-2].user_name
       this.apply_id = res.data.data2[0].id
       this.step_num = res.data.data3.length
       this.approver_name = res.data.data3[0].user_name
       this.apply_time = res.data.data2[0].create_time.substring(0,res.data.data2[0].create_time.length-5)
       this.user_id = res.data.data3[res.data.data3.length-2].user_id
       this.user_name = res.data.data3[res.data.data3.length-2].user_name
       this.start_id = res.data.data3[0].user_id
       this.start_name = res.data.data3[0].user_name
        for(var i=0; i<res.data.data1.length;i++){
                this.goodlist.push({
                    buy_num:res.data.data1[i].buy_num,
                    product_type:res.data.data1[i].product_type,
                    product_name:res.data.data1[i].product_name,
                    id:res.data.data1[i].id,
                    unit_price:res.data.data1[i].unit_price,
                    total_price:res.data.data1[i].total_price,
            })
            this.goodspirce.push({
                name:res.data.data1[i].product_name,
                unit_price:'',
                total_price:'',
            })
    }
     for(var i=0; i<res.data.data3.length-1;i++){
            this.process.push({
              approver_name:res.data.data3[i].user_name,
              order_time:res.data.data3[i].step_date,
              yesorno:res.data.data3[i].step_advice,
              remarks:res.data.data3[i].step_reason,
            })
        }

    
    let length = res.data.data3.length-1
    //曹总
      if(getCookie('user_flag') == 2 && res.data.data3[length].user_id == getCookie('approver_b_id')){
          if(res.data.data3[length].step_num == 2){
               this.flag1 = true
               this.flage = false
               this.flag2=false
               this.flag3=false
               this.flag4=false
          }else{
            console.log('4444444444444444')
             this.flag1 = true
             this.flage = true
             this.flag2=false
             this.flag3=false
             this.flag4=false
            
          }
      }
    //晓晓
      else if(getCookie('user_flag') == 3 && res.data.data3[length].user_id == getCookie('approver_b_id')){
              this.flag1=false
             this.flage=false
             this.flag2=true
             this.flag3=false
             this.flag4=false
            
      }
    //文旭
       else if(getCookie('user_flag') == 4 && res.data.data3[length].user_id == getCookie('approver_b_id')){
              this.flag1=false
             this.flage=false
             this.flag2=false
             this.flag3=true
             this.flag4=false
             
      }
    //项目经理
      else if(getCookie('user_flag') == 1 && res.data.data3[length].user_id == getCookie('approver_b_id')){
          if(res.data.data3[length].step_num !== "1"){
               this.flag1 = false
               this.flage = false
               this.flag2=false
               this.flag3=false
               this.flag4=true
               
          }
      }
   })
  }
};
</script>
<style lang="scss" scoped>
.van-card {
  height: 90px;
}
.van-card__content {
  height: 60px;
}
.van-card__title {
  height: 30px;
  line-height: 30px;
  font-size: 15px;
}
.van-card__desc {
  height: 20px;
  line-height: 20px;
  font-size: 10px;
}
.van-card__num {
  margin-top: -80px;
  font-size: 10px;
}
.van-card__footer {
  margin-top: -60px;
}
.type{
position: absolute;
top:60px;
left:200px
}
.footer {
  position: relative;
  top: 20px;
  display: flex;
  align-items: center;
  justify-content: space-around;
  .van-button {
    width: 150px;
  }
}
.price{
  li{
    .name{
      margin-top:15px; 
    }
    height:20px;
    display: flex;
    justify-content: space-around;
    margin-bottom: 10px;
    input{
      width:90px;
      border: none;
      background-color:#FAFAFA;
      text-align: center;
    }
  }
}
</style>
